<template>
  <div>
    <el-card
      class="box-card"
      :body-style="{ padding: '0px 0', boxSizing: 'border-box' }"
    >
      <pieANDline
        :pieData="pieData"
        :lastMonthData="lastMonthData"
        :monthData="monthData"
        :picInfo="picInfo"
      ></pieANDline>
    </el-card>
  </div>
</template>
<script>
import pieANDline from "@/components/Echarts/pieANDline";
export default {
  data() {
    return {
      fullscreenLoading: false, // loading
      queryObj: {
        sdate: "",
        edate: "",
        group: "game",
      },
      queryLineObj: {
        sdate: "",
        edate: "",
        group: "date",
      },
      pieData: [], // 曲线图数据
      lastMonthData: [], // 上月折线图数据
      monthData: [], // 本月折线图数据
      picInfo: {
        id: "income",
        subtext1: "财收分布",
        subtext2: "财收月对比",
      },
    };
  },
  methods: {
    // 获取数据
    getState() {
      let task = [this.getPieState(), this.getLineState()];
      Promise.all(task).then((res) => {
        if (res[0].code == 0) {
          if (res[0].data) {
            this.pieData = this.extractPieData(res[0].data, "income");
          }
        }
        if (res[1].code == 0) {
          if (res[1].data) {
            this.extractLineData(res[1].data, "regs");
          }
        }
      });
    },
    getPieState() {
      return new Promise((resolve, reject) => {
        this.$api.askIncome(this.queryObj).then((res) => {
          resolve(res);
        });
      });
    },
    getLineState() {
      return new Promise((resolve, reject) => {
        this.$api.askIncome(this.queryLineObj).then((res) => {
          resolve(res);
        });
      });
    },
    // 提取曲线图数据
    extractLineData(input) {
      let outPut = [];
      let arr = new Array(31).fill();
      let now = new Date();
      // 上月
      let lastMonth = now.getMonth()
        ? now.getMonth() < 10
          ? "0" + now.getMonth()
          : now.getMonth()
        : 12;
      // 本月
      let month = now.getMonth() + 1;
      // 提取每月数据
      this.lastMonthData = this.extractLineMonthData(input, lastMonth);
      this.monthData = this.extractLineMonthData(input, month);
    },
    // 提取每月数据
    extractLineMonthData(input, month) {
      return input
        .filter((item, index) => {
          if (item.report_date.substr(5, 2) == month) {
            return item;
          }
        })
        .map((item) => item.income);
    },
    // 提取饼图数据
    extractPieData(input, params) {
      let other = 0;
      // 降序排列
      let res = input.sort(this.compare(params));
      let output = res.map((item, index) => {
        if (index < 10) {
          return { name: item.game_name, value: item.income };
        } else {
          other += item.income;
        }
      });
      output.push({ name: "其它", value: other });
      output.find((item, index) => {
        if (item && item.name == "" && item.name != undefined) {
          output[index].name = "平台";
        }
      });
      return output;
    },
    // 获取上个月1号和本月日期
    getIndexDay() {
      let now = new Date();
      let syear = now.getFullYear();
      let smonth = now.getMonth();
      let sday = "01";
      let eyear = syear;
      let emonth = smonth + 1;
      let eday = now.getDate();
      if (smonth == 0) {
        smonth = 12;
        syear = syear - 1;
      }
      if (smonth < 10) {
        smonth = "0" + smonth;
      }
      if (eday < 10) {
        eday = "0" + eday;
      }
      this.queryObj.sdate = syear + "-" + emonth + "-" + sday;
      this.queryObj.edate = eyear + "-" + emonth + "-" + eday;
      this.queryLineObj.sdate = syear + "-" + smonth + "-" + sday;
      this.queryLineObj.edate = eyear + "-" + emonth + "-" + eday;
    },
  },
  created() {
    this.getIndexDay();
    this.getState();
  },
  mounted() {},
  components: {
    pieANDline,
  },
};
</script>
<style lang='stylus' scoped></style>
